<template>
  <div id="app">
    <router-view />
  </div>
</template>
<script setup>
import { onBeforeMount, onMounted, onBeforeUnmount } from 'vue'
import { useStore } from 'vuex'
import { useRouter } from 'vue-router'
import { getToken } from '@ruifox-cms/utils/src/storage'
import { resetSize } from '@ruifox-cms/utils/src/tools'
import { myDebounce } from './utils/tools'

const store = useStore()
const router = useRouter()
onBeforeMount(async () => {
  if (getToken() && !router.currentRoute.value.meta.whiteList) {
    await  store.dispatch('user/login')
    const { iconInit } = await import('@ruifox-cms/utils')
    const res = await store.dispatch('base/getGroupSetting')
    iconInit(res.publicIcon)
  }
})

//页面响应式
const handleResize = myDebounce(resetSize, 200)
onMounted(() => {
  resetSize()
  window.addEventListener('resize', handleResize); // 监听窗口变化
})
onBeforeUnmount(() => {
  window.removeEventListener('resize', handleResize); // 清除监听
});
</script>

<style lang="scss">
#app{
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}
</style>